<template>
  <div class="box2">
    <h1>我是day11第二个组件</h1>
    <h2>{{sum}}</h2>
    <button @click="funSum(2)">操作mutations中funSum让sum+2</button>
    <button @click="mySum(10)">操作actions中mySum让2秒后sum+10</button>
    <h1>{{ getSum }}</h1>
    <h2>{{userName}}</h2>
  </div>
</template>

<script>
import {mapState,mapMutations,mapActions,mapGetters} from "vuex"
export default {
    name:"MyDay11s",
    data() {
        return {
            
        }
    },
    computed:{
        ...mapState(["sum"]),
        ...mapGetters(["getSum"]),
        ...mapState("userDate",["userName"])
    },
    methods:{
        ...mapMutations(["funSum"]),
        ...mapActions(["mySum"])
    }
}
</script>

<style scoped>
.box2 {
  border: 5px solid pink;
  height: 500px;
}
</style>